<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title id="PageTitle"></title>
    <script>
        var width = document.documentElement.clientWidth;
        var scale = width / 375;
        var css = 'html{font-size:' +
            37.5 * scale +
            'px;}';
        document.write('<style>' + css + '</style>');
    </script>
    <script src="//cdn.bootcss.com/eruda/1.2.6/eruda.min.js"></script>
    <script>eruda.init();</script>
    <script src="https://cdn.bootcss.com/fastclick/1.0.6/fastclick.js"></script>
</head>

<body>
    <div id="app" v-cloak>
        <music :music="BgMusic"></music>
        <func-banner :mananger='true'></func-banner>
        <div class="container">
            <header>
                <div class="banner_img">
                    <img class="bg_title_banner" :src="BannerStr">
                </div>
                <div class="both"></div>
                <div class="activity_slogan">
                    <div class="both"></div>
                    <h1 id="title">{{Title}}</h1>
                </div>
            </header>
            <main>
                <div class="w">
                    <div class="activity_countdown">
                        <p v-if="partinstatus != partinstatusall.AtActInActiveEnd">活动时间结束倒计时:
                            <span class="dynamic_time">
                                <span>{{countDown.days}}</span>天
                                <span>{{countDown.hours}}</span>时
                                <span>{{countDown.minutes}}</span>分
                                <span>{{countDown.seconds}}</span>秒</span>
                        </p>
                        <p v-if="partinstatus == partinstatusall.AtActInActiveEnd">活动已结束</p>
                    </div>
                    <div class="rules_des activity_rules_detail">
                        <div>
                            <p>拼团玩法</p>
                            <p class="look_detail" v-on:click="showRules">查看详情</p>
                        </div>
                        <ul>
                            <li>
                                <div>1</div>
                                <p>支付开团或参加团</p>
                            </li>
                            <li>
                                <div>2</div>
                                <p>邀请好友支付参团</p>
                            </li>
                            <li>
                                <div>3</div>
                                <p>达到人数团购成功</p>
                            </li>
                        </ul>
                    </div>
                    <div class="all_prize activity_rules_detail">
                        <div class="price_des">
                            <p>原价:
                                <span>{{Prizes.PrePrice}}</span>
                            </p>
                            <p>参加拼团需支付:
                                <span>{{Prizes.BeforePrice}}元</span>
                            </p>
                        </div>
                        <div class="prize_price" v-for="item in Prizes.GroupArr">
                            <div class="prize_price_detail">
                                <div class="people">
                                    <div>
                                        <span>{{item.PeoNum}}</span>人团</div>
                                </div>
                                <div class="money">
                                    <div>拼团价:
                                        <span>{{item.Price}}</span>元/人</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="activity_rules" v-if="partinstatus != partinstatusall.AtActInActiveStart">
                        <!-- 某人正在邀请用户参团 -->
                        <div class="activity_rules_detail group_msg" v-if="partinstatus==partinstatusall.ParterLook">
                            <h2>
                                <span>{{JoinerMsg.Name}}</span>邀你来拼团啦!已有
                                <span>{{GroupNow.length}}</span>人,每人{{GroupPrice}}元,盼你如南方人盼暖气</h2>
                            <ul>
                                <li v-for="item in GroupNow">
                                    <div v-if="item.Identity == 'head'" class="group_boss">
                                        <div>团长</div>
                                        <p>{{item.Name}}</p>
                                        <p>于{{item.JoinDate}}开团</p>
                                    </div>
                                    <div v-if="item.Identity == 'member'">
                                        <div>团员</div>
                                        <p>{{item.Name}}</p>
                                        <p>于{{item.JoinDate}}入团</p>
                                    </div>
                                </li>
                                <li>
                                    <div class="wait">
                                        <div>?</div>
                                        <p>就差你了,人越多价格越低,快来参加拼团吧!</p>
                                    </div>
                                </li>
                            </ul>
                            <div class="page_join group_want_join"  v-on:click="AlertJoinPop(1)">我要参加此团</div>
                        </div>
                        <!-- 作为团员邀请他人参团 -->
                        <div class="activity_rules_detail group_msg" v-if="partinstatus==partinstatusall.ParterDone ">
                            <h2>恭喜你成功参团了!已有
                                <span>{{GroupNow.length}}</span>人,每人{{GroupPrice}}元,赶紧邀请好友参团吧</h2>
                            <ul>
                                <li v-for="item in GroupNow">
                                    <div v-if="item.Identity == 'head'" class="group_boss">
                                        <div>团长</div>
                                        <p>{{item.Name}}</p>
                                        <p>于{{item.JoinDate}}开团</p>
                                    </div>
                                    <div v-if="item.Identity == 'member'">
                                        <div>团员</div>
                                        <p>{{item.Name}}</p>
                                        <p>于{{item.JoinDate}}入团</p>
                                    </div>
                                </li>
                            </ul>
                            <div class="page_join group_employee_send"  v-on:click="SendFriend">分享给好友参团</div>
                        </div>
                        <!-- 作为团长邀请他人参团 -->
                        <div class="activity_rules_detail group_msg" v-if="partinstatus==partinstatusall.JoinDone">
                            <h2>恭喜你成功开团了!已有
                                <span>{{GroupNow.length}}</span>人,每人{{GroupPrice}}元,赶紧邀请好友参团吧</h2>
                            <ul>
                                <li v-for="item in GroupNow">
                                    <div v-if="item.Identity == 'head'" class="group_boss">
                                        <div>团长</div>
                                        <p>{{item.Name}}</p>
                                        <p>于{{item.JoinDate}}开团</p>
                                    </div>
                                    <div v-if="item.Identity == 'member'">
                                        <div>团员</div>
                                        <p>{{item.Name}}</p>
                                        <p>于{{item.JoinDate}}入团</p>
                                    </div>
                                </li>
                                <li>
                                    <div>
                                        <div>?</div>
                                        <p>赶紧邀请好友参加你的拼团吧!人越多价越低</p>
                                    </div>
                                </li>
                            </ul>
                            <!--<div class="look_all" v-on:click="showGroup">查看全部</div>-->
                            <div class="page_join group_boss_send" v-on:click="SendFriend">分享给好友参团</div>
                        </div>
                        <!-- 活动已结束状态 -->
                        <div class="activity_rules_detail group_msg" v-if="partinstatus==partinstatusall.AtActInActiveEnd">
                            <h2>活动结束啦!恭喜你的团共{{partners.length+1}}人,每人{{leader.Current}}元,后续兑奖事宜请联系商家</h2>
                            <ul>
                                <li>    
                                    <div>
                                        <div class="group_boss">团长</div>
                                        <p>{{leader.Name}}</p>
                                    </div>
                                    <p>于{{leader.CreateTime}}开团</p>
                                </li>
                                <li v-for="item in partners">
                                    <div>
                                        <div>团员</div>
                                        <p>{{item.Name}}</p>
                                    </div>
                                    <p>于{{item.CreateTime}}加入</p>
                                </li>
                            </ul>
                            <div class="page_activity_over">活动已结束</div>
                        </div>
                        <!-- 活动还未开始状态 -->
                        <div class="activity_rules_detail some_group_msg" v-if="GroupAll.length == 0">
                            <p>还没有人开团哦!马上发送给好友开团吧!</p>
                            <div class="send_to_friend"  v-on:click="SendFriend">
                                <p>发送给好友开团</p>
                            </div>
                        </div>
                        <!-- 活动正在进行中的状态 -->
                        <!-- 只要用户已经开团或参团才会让下面的消失-->
                        <div class="activity_rules_detail some_group_msg" v-if="partinstatus == partinstatusall.JoinJustNow || partinstatus == partinstatusall.ParterLook">
                            <h2>以下小伙伴正在发起拼团,你可以直接参加</h2>
                            <ul>
                                <li v-for="item in GroupAll">
                                    <div>
                                        <p class="some_group_boss">团长:{{item.Name}}</p>
                                        <p>已有
                                            <span>{{item.Number}}</span>人参团&nbsp;&nbsp;&nbsp;每人
                                            <span>{{item.Current}}</span>元</p>
                                    </div>
                                    <div  v-on:click="AlertJoinPop(item.Id)">我要参加</div>
                                </li>
                            </ul>
                            <!--<div>-->
                                <!--<div v-on:click="showGroup" id="look_all">查看全部</div>-->
                            <!--</div>-->
                        </div>
                        <!-- 当用户第一次进入这个页面时 -->
                        <div class="open_group" v-if="partinstatus == partinstatusall.JoinJustNow || partinstatus == partinstatusall.ParterLook">
                            <p>你可以参团购买,也可以自己开团</p>
                            <div class="want_open_group join" v-on:click="AlertJoinPop(0)">我要开团</div>
                        </div>
                    </div>
                    <g-section v-on:child-say="getReadSection" :sedata="Content"></g-section>
                    <div class="both"></div>
                    <div class="both"></div>
                    <div class="both"></div>
                </div>
            </main>
            <div class="footer" style="bottom:1.06667rem;">
                <!--<div class="activity_status">-->
                <!--<div class="look_for_friend bg_white join">我要开团做团长</div>-->
                <!--</div>-->
                <!-- 打开的是一个空链接的时候 -->
                <div class="activity_status" v-if="partinstatus==partinstatusall.JoinJustNow">
                    <div class="look_for_friend bg_white join" v-on:click="AlertJoinPop(0)" >我要开团做团长</div>
                </div>
                <div class="activity_status" v-if="partinstatus==partinstatusall.JoinDone || partinstatus==partinstatusall.ParterDone">
                    <div class="look_for_friend bg_white sendfriend"  v-on:click="SendFriend">分享给好友来一起参团</div>
                </div>
                <div class="activity_status" v-if="partinstatus==partinstatusall.ParterLook">
                    <div class="help_cut bg_white" v-on:click="AlertJoinPop(1)" >我要参加此团</div>
                    <div class="want_join join" v-on:click="AlertJoinPop(0)">我要开团</div>
                </div>
                <div class="activity_status" v-if="partinstatus==partinstatusall.AtActInActiveStart">
                    <div class="activity_over">拼团活动尚未开始</div>
                </div>
                <div class="activity_status" v-if="partinstatus==partinstatusall.AtActInActiveEnd">
                    <div class="look_for_friend bg_white">活动已经结束,感谢参与</div>
                </div>
            </div>
        </div>
        <div class="both"></div>
        <div class="both"></div>
        <div class="both"></div>
        <div class="both"></div>
        <div class="both"></div>
        <div class="both"></div>
        <div class="mask rule">
            <!-- 弹窗 此处为已规则介绍-->
            <div class="Pop-ups_tem">
                <div class="Pop-ups_close">
                    <img src="../../../img/activity/mask_delete.png" alt="" style="width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;">
                </div>
                <h2>拼团规则</h2>
                <div class="pop_content">
                    <div>
                        <p>
                            <span>1. 拼团介绍：</span>由机构发起，使用微信拉好友入团，从而快速完成限定人数，享受让利优惠的团购活动
                            <br>
                            <br>
                            <span>2. 团长：</span>开团且该团第一个支付成功的人
                            <br>
                            <br>
                            <span>3. 团员：</span>通过链接参团成功的成员即为团员，可邀请好友参团，人越多，优惠越多
                            <br>
                            <br>
                            <span>4. 团购成功：</span>团购时间内，参团人数达到设置最低人数，则组团成功
                            <br>
                            <br>
                            <span>5. 团购失败：</span>团购时间内，参团人数未达到设置最低人数，则组团失败，自行联系机构相关退款事宜
                            <br>
                            <br>
                            <span>6. 其他说明：</span>拼团仅支持微信支付，其他场景下支付将无法完成拼团，若因人为因素刷单，恶意开团参团，机构有权解除参与资格
                        </p>
                    </div>
                </div>
                <div class="sure_rules">
                    <p>确定</p>
                </div>
            </div>
            <!-- 弹窗,此处为加载更多团 -->
           <!-- <div class="all_group" v-if="GroupAll.length && ( partinstatus == partinstatusall.JoinJustNow || partinstatus == partinstatusall.ParterLook)">
                <div class="pop_all_group">
                    <header>
                        <p>以下小伙伴正在发起拼团,你可以直接参加</p>
                    </header>
                    <div class="Pop-ups_close">
                        <img src="../../../img/activity/mask_delete.png" alt="">
                    </div>
                    <div class="all_group_content">
                        <div class='more_group'>
                            <ul>

                                <li v-for="item in GroupAll">
                                    <div>
                                        <p class="some_group_boss">团长:{{item.Name}}</p>
                                        <p>已有
                                            <span>{{item.Number + 1}}</span>人参团&nbsp;&nbsp;&nbsp;每人
                                            <span>{{item.Current}}</span>元</p>
                                    </div>
                                    <div  v-on:click="AlertJoinPop(item.Id)">我要参加</div>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="pop_footer">
                        <p>查看更多</p>
                    </div>
                </div>
            </div>
            &lt;!&ndash; 弹窗,此处为查看自己团内团员 &ndash;&gt;
            <div class="all_group" v-if="partinstatus==partinstatusall.JoinDone">
                <div class="pop_all_group">
                    <header>
                        <p>一起报名拼团的小伙伴</p>
                    </header>
                    <div class="Pop-ups_close">
                        <img src="../../../img/activity/mask_delete.png" alt="">
                    </div>
                    <div class="all_group_content">
                        <div class='more_group' v-for="">
                            <ul>请稍等,加载中...</ul>
                        </div>
                    </div>
                    <div class="pop_footer" onclick=''>
                        <p>查看更多</p>
                    </div>
                </div>
            </div>-->
        </div>
        <user-join :othermsg="Other" v-on:join="UserJoinAct" v-on:back="BackMine"></user-join>
        <!-- 报名成功以及提示商家分享方法 -->
        <notice-pop :actstatus="ActStatus"></notice-pop>
        <add-msg :mobile="Mobile"></add-msg>
        <!-- 分享标题以及副标题处弹窗 -->
        <share-pop :sharemsg="ShareMsg"></share-pop>
    </div>
</body>

</html>